@import '~scss/variables';
@import '~scss/mixins';

.card {
  padding: 20px 23px;
  border-radius: 4px;
  background-color: $card-bg-color;

  & + .card {
    margin-top: 8px;
  }
}

.type {
  display: inline-block;
  vertical-align: middle;
  width: 252px;
  margin-left: 28px;
  border-right: dashed 1px #d8dee5;

  p {
    color: $second-text-color;
  }

  :global {
    .h6 {
      font-family: $font-family-id;
      line-height: 1.43;
    }

    .icon {
      margin-top: -2px;
      margin-left: 4px;
    }
  }
}

.reason {
  display: inline-block;
  vertical-align: middle;
  margin-left: 20px;

  span {
    color: #5f708a;
  }
}

.check {
  border-radius: 50%;
  background-color: $primary;
}

.substract {
  border-radius: 50%;
  background-color: $yellow;
}
